<!--
 * @Author: Broin
 * @Date: 2022-01-04 03:26:24
 * @LastEditTime: 2022-01-04 21:31:20
 * @LastEditors: your name
 * @Description: 
 * @FilePath: /ac_interface/src/views/testTerm.vue
 * MADE BY BROIN
-->


<!--
<template>
    <el-button id="bt">点一下</el-button>
    <div id="xterm" class="xterm" />
</template>

<script>
import 'xterm/css/xterm.css'
import { Terminal } from 'xterm'
import { FitAddon } from 'xterm-addon-fit'
import { AttachAddon } from 'xterm-addon-attach'

export default {
  name: 'Xterm',
  props: {
    socketURI: {
      type: String,
      default: 'ws://172.21.4.154:4001'
    },
  },
  mounted() {
    this.initSocket()
  },
  beforeDestroy() {
    this.socket.close()
    this.term.dispose()
  },
  methods: {
    initTerm() {
      const term = new Terminal({
        fontSize: 14,
        cursorBlink: true
      });
      const attachAddon = new AttachAddon(this.socket);
      const fitAddon = new FitAddon();
      term.loadAddon(attachAddon);
      term.loadAddon(fitAddon);
      term.open(document.getElementById('xterm'));
      fitAddon.fit();
      term.focus();
      this.term = term
    },
    initSocket() {
      this.socket = new WebSocket(this.socketURI);
      console.log('initsock');
      this.socketOnClose();
      this.socketOnOpen();
      this.socketOnError();
    },
    socketOnOpen() {
      this.socket.onopen = () => {
        // 链接成功后
        this.initTerm()
      }
    },
    socketOnClose() {
      this.socket.onclose = () => {
        // console.log('close socket')
      }
    },
    socketOnError() {
      this.socket.onerror = () => {
        // console.log('socket 链接失败')
      }
    }
  }
}
</script>
-->

<template>
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <el-button id="bt" @click="createServer">点一下</el-button>
    <div id="xterm" class="xterm" />
</template>

<script>
import openSocket from 'socket.io-client';
import { Terminal } from 'xterm';




export default ({
  name: 'term',
  setup() {
    
  },
  mounted() {
    this.initSock();
  },
  methods: {
    initSock(){
      this.ws = new openSocket('http://127.0.0.1:4002');
    },
    createServer() {
      this.ws.emit('createSSHServer', {
        host: '172.21.4.154',
        username: 'root',
        password: 'Nibushiwo351351'
      });
      let term = new Terminal({
        fontSize: 14,
        cursorBlink: true
      });
      term.onData((data) => {
        this.ws.emit(data);
      });
      this.ws.on((data) => {
        term.write(data);
      });
    }
  }
})
</script>
